<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>{$Think.lang.message_feedback}</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="INDEX/css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="INDEX/css/main.css"/>
		<style type="text/css">
			.my_news_list{
				background: #fff;
				width: 100%;
				margin-bottom: 0.5em;
			}
			.my_news_content .my_news_list:last-child{
				margin-bottom: 40px;
			}
			.news_list_top{
				width: 100%;
				padding: 0.5em;				
				display: flex;				
				justify-content: space-between;
				border-bottom: 1px solid #f2f2f2;
			}
			.news_list_middle{
				width: 100%;
				overflow: hidden;				
				white-space: nowrap;				
				text-overflow: ellipsis;						
				font-size: 0.9em;				
				padding: 0.5em;
			}
			.news_list_bottom{
				padding: 0.5em;
				font-size: 0.8em;			
				display: flex;			
				justify-content: space-between;
			}
			.show_news_detail{
				width: 23%;
				height: 25px;			
				border: 1px solid #38A6EF;
				text-align: center;		
				color: #38A6EF;		
			}
			.add_news{
				width:100%;
				background: #CAAB7C;
				color: #FFFFFF;
				text-align: center;
				height: 40px;
				line-height:40px;
				position: fixed;
				bottom: 0;
				z-index: 999;
			}
			.alert_news{
				display: none;
				width:100%;
				height: 100%;
				position: fixed;
				top: 0;
				left: 0;
				background-color: rgba(123,123,123,0.5);
			}
			.alert_detail{
				width: 90%;
				background: #FFFFFF;
				margin: 0.5em auto;
				font-size: 0.8em;			
				padding: 0.5em;
				position: fixed;
				top: 25%;
				left: 5%;
				border-radius: 5px;
			}
			.alert_detail_top,.alert_detail_bottom{
				padding: 1em;				
			}
			.alert_detail_top{
				border-bottom: 1px solid #F2F2F2;
			}
           .mui-switch{
      		width:36px;
        	height:18px;
      }
      header div{
      		top : 30%;
      }
      .mui-switch .mui-switch-handle{
      		width:20px;
        	height:20px;
        left:-4px;
        top: -3px;
      }
      .mui-switch.mui-active:before{
      	top:-3px;
        left:1px;
      }
      .mui-switch.mui-active .mui-switch-handle {
    	-webkit-transform: translate(43px,0);
    	transform: translate(20px,0);
		}
      .mui-switch:before{
      		top:-3px;
        	left:15px;
      }
		</style>
	</head>

	<body>
		<script src="INDEX/js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<script src="INDEX/js/mui.min.js"></script>
		<script src="INDEX/js/jquery-1.8.0.min.js" type="text/javascript" charset="utf-8"></script>	
		<script>
			mui.init();
		</script>
		<header class="mui-bar mui-bar-nav">
			<a href="#offCanvasSide" class="right_top"></a>
			<!--<a class="mui-switch "></a>-->
			<div class="mui-switch mui-pull-right {if $think_var=='zh-cn'}mui-active{/if}" id="mySwitch">
  				<div class="mui-switch-handle"></div>
			</div>
			<h1 class="mui-title">{$Think.lang.project_title}</h1>
		</header>
		<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable mui-slide-in">
			<div id="header">{include file='header'/}</div>
			<div class="mui-inner-wrap">
				<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper mui-slide-in">
					<div class="mui-scroll">
						<div class="my_news_content">
							<div class="my_news_list">
                                {foreach $result as $res}
								<div class="news_list_top">
									<span style="color: #878787; font-size: 0.8em;">{$res['create_time']|date="Y-m-d H:i:s",###}</span>
									<span style="font-size: 0.8em;">
										{$Think.lang.not_status}：<span id="state" style="color:#F52824;font-size: 1em;">{if $res['status'] eq 0}{$Think.lang.not_reply}{else}{$Think.lang.not_replys}{/if}</span>
									</span>
								</div>
								<div class="news_list_middle">
									{$res['question']}
								</div>
								<div class="news_list_bottom" >
									<span style="color: #878787;">{$Think.lang.not_cate}：
										<span id="type" style="color: #38A6EF;">
											{if $think_var=="zh-cn"}
											{$res['advisory_name']}
											{else}
											{$res['advisory_name_en']}
											{/if}
										</span>
									</span>
									<span class="show_news_detail encrypt" id="{$res['id']}">{$Think.lang.not_detail}</span>
                                </div>
                                {/foreach}
							</div>
							{foreach $result as $res}
							<div class="alert_news" id="alert_news{$res['id']}">
									<div class="alert_detail dissal" id="{$res['id']}">
										<div class="alert_detail_top">
											<h4 style="color: #34A2D9;font-weight: normal;">{$Think.lang.not_mess_question}</h4>
											<div>
											<!-- 理财，顾名思义指的就是管理财务。一般人谈到理财，想到的不是投资，就是赚钱。实际上理财的范围很广，理财是理一生的财，也就是个人一生的现金流量与风险管理。包含以下涵义： -->
											{$res['question']}
											</div>
										</div>
										{if condition = "$res['answer'] neq ''"}
										<div class="alert_detail_bottom">
											<h4 style="color:#F02424;font-weight: normal;">{$Think.lang.not_mess_answer}</h4>
											<div>
											{$res['answer']}					
											</div>
										</div>
										{/if}
									</div>
								
							</div>
							{/foreach}
							
					</div>
				</div>
			</div>	
		</div>
        <div class="add_news">{$Think.lang.not_add}</div>
		<script src="INDEX/js/switchover.js"></script>
		
		<script src="INDEX/js/jquery-1.8.0.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		       mui('#offCanvasSideScroll').scroll();
				mui('#offCanvasContentScroll').scroll();
				// var show_news_detail = document.getElementsByClassName("show_news_detail")[0];
				// show_news_detail.addEventListener("tap", function () {
					mui(".news_list_bottom").on("tap",".encrypt",function(){
						// alert(123);//
						var ids = this.getAttribute("id");
					// alert(213);
					$("#alert_news"+ids).show();
				})
				// var alert_news = document.getElementsByClassName("alert_news")[0];
				mui(".alert_news").on("tap",".dissal",function(){
					// alert(123);
						var ids = this.getAttribute("id");
					$("#alert_news"+ids).hide();
				})
				var add_news = document.getElementsByClassName("add_news")[0];
				add_news.addEventListener("tap", function () {
                window.location.href = "{:Url('index/notice/add')}";
            })
		</script>
	</body>

</html>